<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/include/page.jsp"%>
<c:set value="${requestScope.response.data.pageInfoUtil }" var="pageInfoUtil"/>
<c:set value="${requestScope.response.data.one }" var="one"/>
<c:set value="${requestScope.commentApiResponse.data.list }" var="commentList"/>
<!DOCTYPE html>
<html lang="en">
	<head>
		<title>商品详情 - 美妆产品销售系统</title>
		<%@ include file="/common/include/head_title.jsp"%>
	</head>
	<body>
		<jsp:include page="/IndexHeadServlet">
			<jsp:param value="header" name="method"/>
		</jsp:include>
		<section class="page-content-wrapper ptb-100">
			<!-- Single Product Top Info Start -->
			<div class="container">
				<div class="row">
					<div class="col-md-12">
						<div class="breadcrumbs mb-40">
							<ul>
								<li class="home">
									<a title="首页" href="${rootPath }/IndexHeadServlet?method=main">首页</a>
									<span class="arrow_carrot-right"></span>
								</li>
								<li class="home">
									<a title="Go to Paroduct page" href="${rootPath }/IndexHeadServlet?method=productInfo&id=${one.id}">商品详情</a>
									<span class="arrow_carrot-right"></span>
								</li>
								<li class="category3">
									<span>${one.name }</span>
								</li>
							</ul>
						</div>
					</div>
					<div class="col-md-6">
						<div class="singlepro-left">
							<div class="pro-img-tab-content tab-content">
								<div class="tab-pane active" id="image-1">
									<div class="simpleLens-big-image-container">
										<a class="simpleLens-lens-image" data-lightbox="roadtrip"
											data-lens-image="${rootPath}/img/single-product/1.jpg"
											href="${rootPath}/img/single-product/1.jpg">
											<img src="${rootPath}/img/single-product/1.jpg" alt="" width="570" height="400"
												class="simpleLens-big-image">
										</a>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-md-6">
						<div class="singlepro-right">
							<div class="snglepro-content">
								<span>今日新品</span>
								<h3><a href="${rootPath }/IndexHeadServlet?method=productInfo&id=${one.id}">${one.name }</a></h3>
								<!-- <div class="rating-box">
									<i class="fa fa-star"></i>
									<i class="fa fa-star"></i>
									<i class="fa fa-star"></i>
									<i class="fa fa-star"></i>
									<i class="fa fa-star"></i>
									<span>3 Reviews</span>
								</div> -->
								<div class="prce-stock">
									<h4>Y${one.price }</h4>
									<h6>销量:${one.saleNum}</h6>
								</div>
								<p>${one.brief}</p>
								<!-- <div class="pro-info">
									<ul>
										<li>SKU: JQK123</li>
										<li>Categories: Man, Shoes</li>
										<li>Tags: shoes, man shoes, black</li>
									</ul>
								</div> -->
								<div class="input-content mb-50">
									<label><a href="" onclick="return addCart('${one.id}','1')">添加购物车</a></label>
									<!-- <div class="quantity">
										<div class="cart-plus-minus"><div class="dec qtybutton">-</div>
										  <input type="text" value="0" name="qtybutton" class="cart-plus-minus-box">
										 <div class="inc qtybutton">+</div></div>
									</div> -->
								</div>
								<!-- <div class="sngle-pro-socl">
									<ul>
										<li><a href="#" class="social_facebook"></a></li>
										<li><a href="#" class="social_googleplus"></a></li>
										<li><a href="#" class="social_twitter"></a></li>
									</ul>
								</div> -->
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- Single Product Top Info Start -->
			<!-- Single Product Discription Start -->
			<section class="pro-disciptin mt-100">
				<div class="container">
					<div class="row">
						<div class="col-lg-12 col-md-12 col-sm-12">
							<div class="p-details-tab">
								<ul role="tablist">
									<li role="presentation" class="active">
										<a href="#description" aria-controls="description" role="tab" data-toggle="tab">描述</a>
									</li>
									<!-- <li role="presentation">
										<a href="#reviews" aria-controls="reviews" role="tab" data-toggle="tab">additional information </a>
									</li>
									<li role="presentation">
										<a href="#tags" aria-controls="tags" role="tab" data-toggle="tab">review (3)</a>
									</li>
									<li role="presentation">
										<a href="#cutomer" aria-controls="tags" role="tab" data-toggle="tab">customer tab</a>
									</li> -->
								</ul>
							</div>
							<div class="tab-content review">
								<div role="tabpanel" class="tab-pane active" id="description">
									<p>${one.content }</p>
								</div>
								<div role="tabpanel" class="tab-pane" id="reviews">
									<div class="row">
										<div class="col-md-6">
											<div class="review-left">
												<p> <a href="#">Hastech</a><span> Review by </span> Hastech </p>
												<div class="review-rating">
													<p>price</p>
													<div class="rating">
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
													</div>
												</div>
												<div class="review-rating">
													<p>value</p>
													<div class="rating">
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
													</div>
												</div>
												<div class="review-rating">
													<p>quality</p>
													<div class="rating">
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
														<i class="fa fa-star"></i>
													</div>
												</div>
												<p>Hastech <span class="italic">(Posted on 11/4/2015)</span></p>
											</div>
										</div>
										<div class="col-md-6">
											<div class="review-right">
												<h3>You're reviewing: Tristique ut lectus</h3>
												<h4>How do you rate this product? *</h4>
												<form action="mail.php" method="post">
													<div class="p-details-table table-responsive">
														<table>
															<thead>
																<tr>
																	<th></th>
																	<th>1 star</th>
																	<th>2 stars</th>
																	<th>3 stars</th>
																	<th>4 stars </th>
																	<th>5 stars </th>
																</tr>
															</thead>
															<tbody>
																<tr>
																	<th>Price</th>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																</tr>
																<tr>
																	<th>Value</th>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																</tr>
																<tr>
																	<th>Quality</th>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																	<td><input type="radio" class="radio" value=""></td>
																</tr>
															</tbody>
														</table>    
													</div>
												</form>    
											</div>
										</div>
									</div>
								</div>
								<div role="tabpanel" class="tab-pane" id="tags">
									<div class="product-tag-name">
										<form action="https://devitems.com/tf/stepre-preview/stepre/mail.php" method="post">
											<div class="row form-top">
												<div class="form-group col-sm-12 col-md-12 col-lg-12">
													<label>Add Your Tags:</label>
													<input type="text" class="form-control">
													<a class="add-tag-btn" href="#">ADD Tags</a>
												</div>
											</div>
										</form>
										<p>Use spaces to separate tags. Use single quotes (') for phrases.</p>
									</div>
								</div>
								<div role="tabpanel" class="tab-pane" id="cutomer">
									<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum d</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- Single Product Discription End -->
		</section>
		<%@ include file="/common/include/head_footer.jsp"%>
	</body>
</html>